<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<table>
	<thead>
	    <tr>
	      <th>ID</th>
	      <th>Benutzername</th>
	      <th>Abgegeben</th>
	      <th class="filter-false remove sorter-false">Ergebnisse</th>  
	      <th class="filter-false remove sorter-false">Abgabe Zurücksetzen</th>       
	    </tr>
  	</thead>
	<tbody >
		<?php $i = 0; ?>
		<?php foreach ($kurseteilnehmer as $row): ?>
	    <tr>
	        <td><?php echo $row['UserID'];?></td>
	        <td><?php echo $username[$i];?></td>
	        <td><?php echo $klausurenschueler[$i];?></td>
	        <?php $i++; ?>
	        <td>
		    	<?php echo validation_errors(); ?>
				<?php echo form_open('klausurenfragen_controller/showresults')?>
				<input type="input" name="schuelerid" value=<?php echo $row['UserID'];?> hidden="true" />
				<input type="input" name="klausurenid" value=<?php echo $klausurenid;?> hidden="true" />
	        	<input class="art-button" type='submit' name='submit' value='Zeige Ergebnisse' > 	
	        	</form>        
	        </td>
	        <td>
		    	<?php echo validation_errors(); ?>
				<?php echo form_open('kurseteilnehmer_controller/returnsubmit')?>
				<input type="input" name="schuelerid" value=<?php echo $row['UserID'];?> hidden="true" />
				<input type="input" name="klausurenid" value=<?php echo $klausurenid;?> hidden="true" />
	        	<input class="art-button" type='submit' name='submit' value='Abgabe Zurücksetzen' > 	    
	        	</form>    
	        </td>
	 		       
	    </tr>
		<?php endforeach; ?>
	</tbody>
</table>
<div id="pager" class="pager">
	<form>
		<img src="<?php echo base_url();?>assets/tablesorter/addons/pager/icons/first.png" class="first"/>
		<img src="<?php echo base_url();?>assets/tablesorter/addons/pager/icons/prev.png" class="prev"/>
		<input type="text" class="pagedisplay" disabled="disabled"/>
		<img src="<?php echo base_url();?>assets/tablesorter/addons/pager/icons/next.png" class="next"/>
		<img src="<?php echo base_url();?>assets/tablesorter/addons/pager/icons/last.png" class="last"/>
		<select class="pagesize">
			<option selected="selected"  value="10">10</option>
			<option value="5">5</option>
			<option value="30">30</option>
			<option  value="40">40</option>
		</select>
	</form>
</div>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Noten', 'Anzahl'],
          ['1',  <?php echo $notenspiegel['1'] ?>],
          ['2',  <?php echo $notenspiegel['2'] ?>],
          ['3',  <?php echo $notenspiegel['3'] ?>],
          ['4',  <?php echo $notenspiegel['4'] ?>],
          ['5',  <?php echo $notenspiegel['5'] ?>],
          ['6',  <?php echo $notenspiegel['6'] ?>]
        ]);

        var options = {
          title: 'Notenspiegel',
          hAxis: {title: 'Noten', titleTextStyle: {color: 'black'}},
          vAxis: {title: 'Anzahl', titleTextStyle: {color: 'black'}}
        };

        var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>

<script>
$(document).ready(function() 
    { 
        $("table").tablesorter({ 
        theme: 'green',
        widthFixed: false, 
        widgets: ['zebra','filter'] 
    })
    .tablesorterPager({container: $("#pager")});
    
    } 
); 
</script>
